
import React, { useState, useEffect } from 'react'
import { Space, Table, Pagination, Button } from 'antd';
import axios from 'axios';
const rowSelection = {
  onChange: (selectedRowKeys, selectedRows) => {

  },
  getCheckboxProps: (record) => ({
    disabled: record.name === 'Disabled User',
    // Column configuration not to be checked
    name: record.name,
  }),
};

export default function Parts() {
  const [dataSource, setDataSource] = useState([])
  const [dataTotal, setDataTotal] = useState([])
  const [selectionType, setSelectionType] = useState('checkbox');


  const columns = [
    {
      title: '序号',
      dataIndex: 'index',
      key: 'index',
      align: "center",
      fixed: "left",
      width: "5%",
      render: (text, record, index) => {
        return <span style={{ fontSize: "12px" }}>{index + 1}</span>
      }
    },
    {
      title: '零件批次',
      dataIndex: 'partbatch',
      key: 'partBatch',
      align: "center",
      fixed: "left",
      width: "15%",
      render: (text) => {
        return <span style={{ fontSize: "12px" }}>{text}</span>
      }
    },
    {
      title: '零件名称',
      dataIndex: 'partname',
      key: 'partName',
      align: "center",
      width: "15%",
      render: (text) => {
        return <span style={{ fontSize: "12px" }}>{text}</span>
      }
    },
    {
      title: "生产公司",
      dataIndex: 'procompany',
      key: 'proCompany',
      align: "center",
      className: "wrapTitle",
      width: "20%",
      render: (text) => {
        return <span style={{ fontSize: "12px" }}>{text}</span>
      }
    },
    {
      title: '购进时间',
      dataIndex: 'buytime',
      key: 'buyTime',
      align: "center",
      width: "12%",
      className: "wrapTitle",
      render: (text) => {
        return <span style={{ fontSize: "12px" }}>{text}</span>
      }
    },
    {
      title: '备注',
      dataIndex: 'comment',
      key: 'comment',
      align: "left",
      render: (text) => {
        return <span style={{ fontSize: "12px" }}>{text}</span>
      }
    }
  ];
  useEffect(() => {
    axios.get("/part/selectpart").then(res => {
      setDataSource(res.data)
      setDataTotal(res.data.length)
    })
  }, [])
  const reGetData = () => {
    axios.get("/part/selectpart").then(res => {
      setDataSource(res.data)
      setDataTotal(res.data.length)
    })
  }



  return (
    <div>

      <div style={{ textAlign: "right" }}>
        <Button style={{ color: "black", fontSize: "12px", borderRadius: "4px", margin: "0 0 0 10px" }} onClick={() => reGetData()}>刷新</Button>
      </div>
      <Table
        rowSelection={{
          type: selectionType,
          ...rowSelection,
        }}
        rowKey={(item) => item.id}
        columns={columns} dataSource={dataSource} style={{ margin: "5px 0 0 0" }}
        pagination={{ pageSize: 10 }}
        size='small'
        scroll={{ x: 1200 }}
      >
      </Table>
    </div >
  )
}
